<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册页面</title>
    <link rel="stylesheet" type="text/css" href="/css/register.css">
</head>
<body>
<div id="app">
    <div class="header">
        <h3 style="position: relative;left: 150px;">用户注册</h3>
    </div>
    <div class="content">
        <table>
            <tr>
                <td class="text-right">用户名</td>
                <td class="content_right"><input class="input" id="username" placeholder="请输入用户名"></td>
            </tr>
            <tr>
                <td class="text-right">密码</td>
                <td class="content_right"><input class="input" id="password1" type="password" placeholder="请输入密码"></td>
            </tr>
            <tr>
                <td class="text-right">确认密码</td>
                <td class="content_right"><input class="input" id="password2" type="password" placeholder="请重复密码"
                                                 onblur="checkPassword()"></td>
            </tr>
            <tr>
                <td class="text-right">姓名</td>
                <td class="content_right"><input class="input" id="name" placeholder="请输入姓名"></td>
            </tr>
            <tr>
                <td class="text-right">手机号码</td>
                <td class="content_right"><input class="input" id="phone" placeholder="请输入手机号码"></td>
            </tr>
            <tr>
                <td class="text-right">学号</td>
                <td class="content_right"><input class="input" id="code" placeholder="请输入学号"></td>
            </tr>

            <tr>
                <td></td>
                <td class="content_right"><span class="btn btn-info" id="submit">立即提交</span></td>
            </tr>
        </table>
    </div>
</div>
</body>
<script src="/jquery/jquery2.1.4.js"></script>
<script src="/layer/layer.js"></script>
<script>
    function checkPassword() {
        var password1 = $("input:eq(1)").val();
        var password2 = $("input:eq(2)").val();
        if (password1 != password2) {
            layer.msg("两次输入密码不相同");
            return;
        }
    }
</script>
<script>
    $(function () {
        $("#submit").click(function () {
            var username = $("input:eq(0)").val();
            var password1 = $("input:eq(1)").val();
            var password2 = $("input:eq(2)").val();
            var name = $("input:eq(3)").val();
            var phone = $("input:eq(4)").val();
            var code = $("input:eq(5)").val();

            if (username.match(/^\w{5,18}$/) == null) {
                layer.msg("请输入5-18位正确字符作为用户名");
                return;
            }
            if (password1.match(/^\w{6,18}$/) == null) {
                layer.msg("请输入6-18位正确字符作为密码");
                return;
            }
            if (password1 != password2) {
                layer.msg("两次输入密码不相同");
                return;
            }
            if (name.length < 1) {
                layer.msg("姓名不能为空");
                return;
            }
            if (phone.match(/(^1[3|4|5|7|8]\d{9}$)|(^09\d{8}$)/) == null) {
                layer.msg("请输入正确的手机号");
                return;
            }
            if (code.match(/(\d{3,8}$)/) == null) {
                layer.msg("请输入3-8位纯数字的学号");
                return;
            }

            var windowId = layer.load();
            var data = {
                "username": username,
                "realName": name,
                "phoneNumber": phone,
                "studentNumber": code,
                "password": password1
            };
            $.ajax({
                url: "/api/user/register",
                data: JSON.stringify(data),
                type: "POST",
                contentType: "application/json",
                dataType: "json",
                success: function (data) {
                    layer.close(windowId);
                    layer.msg(data.msg);
                    console.log(data.msg);
                    if (data.code == 0) {
                        //录入成功
                        $("input").val("");
                        location.assign("/login");
                    } else {
                        //录入失败

                    }
                }
            })
            // $.post("/api/user/register", {
            //     "name": name,
            //     "phone": phone,
            //     "code": code,
            //     "password": password1
            // }, function (data) {
            //     layer.close(windowId);
            //     layer.msg(data.msg);
            //     if (data.code == 0) {
            //         //录入成功
            //         $("input").val("");
            //         location.assign("login.html");
            //     } else {
            //         //录入失败
            //
            //     }
            // });
            return;
        });
    });
</script>
</html>
